<template>
	<view>
		<view class="uni-padding-wrap">
			<view class="page-section swiper">
				<view class="page-section-spacing">
					<swiper class="swiper"  autoplay="true" interval="5000" duration="500">
						<swiper-item v-for="(item,index) in List">
							<fui-card>
								<img class="fui-cover" :src="swiperList ? swiperList[index]:'/static/bg-fllower.jpg'" mode="aspectFill"></img>
								<view class="fui-card__title">
									<view class="u---text">
										<view class="u---text-next">
										<u-icon size="25" name="../../static/addresss.png" style="display: inline-block;width: 20%;"></u-icon>
										<u--text :text="item.name" style="display: inline-block;width: 50%;"></u--text>	
										</view>
									</view>
									<view class="u---text">
										<view class="u---text-next">
										<u-icon size="25" name="../../static/time.png" style="display: inline-block;width: 20%;"></u-icon>
										<u--text  :text="item.date"></u--text>
										</view>
									</view>
								</view>
							</fui-card>
						</swiper-item>
					</swiper>
				</view>
			</view>
		</view>
	
	</view>
</template>

<script>
	export default {
		props:{
			dataList:Array
		},
		name:"uswiper",
		data() {
			return {
				List:[],
				swiperList:[]
			};
		},
		mounted() {
			if(!this.dataList){
				this.initDate()
			}else{
				
			}
			console.log(this.swiperList)
		},
		methods:{
			initDate(){
				this.$http.httpGet("green/findGreenLandLimit",'').then(susess=>{
					this.List=susess.data.data
					console.log(this.List)
					this.showPhoto()
					// console.log(this.List)
				})
			},
			showPhoto(){
				this.List.forEach((item,index)=>{
					this.swiperList.push(item.greenLandPhotos[0].photoUrl)
					// console.log(item.greenLandPhotos[0].photoUrl)
					//每个绿地只显示一张
					// 遗弃,以待以后优化
					// 	this.$http.httpPost("greenLand/getBase64ThroughGreenLandPhotoUrl",item.greenLandPhotos[0].photoUrl).then(susess=>{
					// 			// console.log(susess)
					// 			this.swiperList.push(susess.data.data)
					// })
				})
				
			}
		}
	}
</script>

<style>
	.fui-cover {
		width: 100%;
		height: 385rpx;
		display: block;
	}
	.fui-card__title {
		width: 100%;
		padding: 32rpx;
		box-sizing: border-box;
		font-weight: 500;
	}	
.swiper{
	margin-left: 2.5%;
		height: 460rpx;
		margin-top: 5%;
		width: 95%;
	}
	.u---text{
		width: 50%;
		display: inline-block;
	}
	.u---text-next{
		display: flex;
		align-items: center;
	}
</style>
